@font-face {
	font-family: "<%= fontName %>";
	src: url("<%= fontRefer %>/<%= fontName %>.eot");
	src: url("<%= fontRefer %>/<%= fontName %>.eot?#iefix") format("embedded-opentype"),
		url("<%= fontRefer %>/<%= fontName %>.woff2") format("woff2"),
		url("<%= fontRefer %>/<%= fontName %>.woff") format("woff"),
		url("<%= fontRefer %>/<%= fontName %>.ttf") format("truetype"),
		url("<%= fontRefer %>/<%= fontName %>.svg#<%= fontName %>") format("svg");
}

[class^="<%= className %>-"],
[class*=" <%= className %>-"] {
	font-family: "<%= fontName %>";
	display: inline-block;
	width: auto;
	height: auto;
	font-size: inherit;
	font-weight: normal;
	font-style: normal;
	line-height: normal;
    text-decoration: inherit;
	text-rendering: auto;
	vertical-align: baseline;
	background-image: none;
	background-position: 0 0;
	background-repeat: repeat;
	margin-top: 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
[class^="<%= className %>-"]::before,
[class*=" <%= className %>-"]::before {
	text-decoration: inherit;
	display: inline-block;
	speak: none;
}

.<%= className %>-font-bg { 
	/* 透明字 使用覆盖图片 */
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 10em;
	color: transparent !important;
}
.<%= className %>-font-bg::before {
	color: transparent !important;
}

/* 扩展图标样式 */
@keyframes spin {
  0% {
    transform: rotate(0deg); 
  }
  100% {
    transform: rotate(359deg);
  } 
}

[class^="icon-"].icon-spin,
[class*=" icon-"].icon-spin {
  animation: spin 2s infinite linear; 
}
[class^="icon-"].icon-pulse,
[class*=" icon-"].icon-pulse {
  animation: spin 1s infinite steps(8);
}
[class^="icon-"].icon-pulse-4,
[class*=" icon-"].icon-pulse-4 {
  animation: spin 1s infinite steps(4);
}
[class^="icon-"].icon-pull-left,
[class*=" icon-"].icon-pull-left {
  margin-right: .3em; 
}
[class^="icon-"].icon-pull-right,
[class*=" icon-"].icon-pull-right {
  margin-left: .3em; 
}
.icon-pull-left {
  float: left; 
}
.icon-pull-right {
  float: right; 
}
.icon-large:before {
  vertical-align: -10%;
  font-size: 1.3333333333333333em; 
}
.icon-2x {
  font-size: 2em; 
}
.icon-3x {
  font-size: 3em; 
}
.icon-4x {
  font-size: 4em; 
}
.icon-border {
  border: solid 1px #eee;
  padding: .2em .25em .15em;
  border-radius: 3px; 
}
.icon-border.icon-4x {
  border-width: 4px;
  border-radius: 6px; 
}
.icon-border.icon-3x {
  border-width: 3px;
  border-radius: 5px; 
}
.icon-border.icon-2x {
  border-width: 2px;
  border-radius: 4px; 
}

.icon-muted {
  color: #eee; 
}

<% _.each(glyphs, function(glyph) { %>
.v5-<%= glyph.name %>::before {
	content: "\<%= glyph.unicode['0'].charCodeAt(0).toString(16).toUpperCase() %>";
}<% }); %>
